
var dataSet = [
               ["1","201401","32","58", "43"],
               ["2","201402","60","75", "88"],
               ["3","201403","97","90", "100"],
               ["4","201404","120","120", "120"],
               ["5","201405","143","145", "140"],
               ["6","201406","157","161", "160"],
               ["7","201407","183","181", "179"],
               ["8","201408","161","157", "164"],
               ["9","201409","216","214", "219"],
               ["10","201410","206","211", "209"],
               ["11","201411","175","179", "182"],
               ["12","201412","184","182", "180"]
              ]; // input data

$(document).ready(function() {
	var graphdef = {
			categories : ['Product 1', 'Product 2', 'Product 3'],
		    dataset : {
		        'Product 1' : [
		            { name : '201401', value : 32 },
		            { name : '201402', value : 60 },
		            { name : '201403', value : 97 },
		            { name : '201404', value : 120 },
		            { name : '201405', value : 143 },
		            { name : '201406', value : 157 },
		            { name : '201407', value : 183 },
		            { name : '201408', value : 161 },
		            { name : '201409', value : 216 },
		            { name : '201410', value : 206 },
		            { name : '201411', value : 175 },
		            { name : '201412', value : 184 }
		        ],
		        
		        'Product 2' : [
		            { name : '201401', value : 58 },
		            { name : '201402', value : 75 },
		            { name : '201403', value : 90 },
		            { name : '201404', value : 120 },
		            { name : '201405', value : 145 },
		            { name : '201406', value : 161 },
		            { name : '201407', value : 181 },
		            { name : '201408', value : 157 },
		            { name : '201409', value : 214 },
		            { name : '201410', value : 211 },
		            { name : '201411', value : 179 },
		            { name : '201412', value : 182 }
		        ],
		        
		        'Product 3' : [
		            { name : '201401', value : 43 },
		            { name : '201402', value : 88 },
		            { name : '201403', value : 100 },
		            { name : '201404', value : 120 },
		            { name : '201405', value : 140 },
		            { name : '201406', value : 160 },
		            { name : '201407', value : 179 },
		            { name : '201408', value : 164 },
		            { name : '201409', value : 219 },
		            { name : '201410', value : 209 },
		            { name : '201411', value : 182 },
		            { name : '201412', value : 180 }
		        ]
		    }
	};
	var config = {
		    meta : {
		    	position : '#uv-div',
		        caption : 'Commissions by Product',
		        subcaption : '(Life Insurance)',
		        hlabel : 'Premium Period (YYYYMM)',
		        vlabel : 'Commissiona',
		        vsublabel : '(Baht)'
		    },
			graph: {
				orientation : 'Vertical',
				custompalette : ['#1a99aa', 'orange', 'pink']
			},
			legend : {
				position : 'right'
			},
			dimension : {
				width : 700,
				height : 400
			},
			margin : {
				left : 70
			}
			};
	
	uv.chart ('StackedBar', graphdef, config);
//	uv.chart ('Bar', graphdef, config2);
//	var chart = uv.chart('Area', graphdef);
	
	
	$('#customerStatisticDataTable').DataTable({
		"data": dataSet,
		"oLanguage": {
            "oPaginate": {
                          "sFirst": "หน้าแรก",// ปุ่มกลับมาหน้าแรก
                          "sLast": "หนัาสุดท้าย",//ปุ่มไปหน้าสุดท้าย
                          "sNext": "ถัดไป", //ปุ่มหน้าถัดไป
                          "sPrevious": "ก่อนหน้า" // ปุ่ม กลับ
                        	  },
             "sLengthMenu": "แสดง _MENU_ รายการ ต่อหน้า",  
             "sZeroRecords": "ไม่พบข้อมูลที่ค้นหา", 
             "sInfo": "แสดง _START_ ถึง _END_ จากทั้งหมด _TOTAL_ รายการ",
             "sEmptyTable": "ไม่พบรายการข้อมูล",
             "sLoadingRecords": "ระบบกำลังประมวลผล กรุณารอซักครู่",
             "sProcessing": "ประมวลผลข้อมูล",
             "sInfoEmpty": "ไม่พบรายการข้อมูลที่แสดง",
             "sInfoFiltered": "(จากทั้งหมด _MAX_ รายการ)",  
             "sSearch": "ค้นหา :"
        },
		searching: true,
		"aoColumns" : [ {"sTitle": "ลำดับ", sClass: "alignCenter", "bSortable": false, sWidth: '10%'},
		                {"sTitle": "วันที่ (YYYYMM)", sClass: "alignCenter", "bSortable": false, sWidth: '25%'},
		                {"sTitle": "10003412", sClass: "alignCenter", "bSortable": false, sWidth: '20%'},
		                {"sTitle": "10003600", sClass: "alignCenter", "bSortable": false, sWidth: '20%'},
		                {"sTitle": "10003409", sClass: "alignCenter", "bSortable": false, sWidth: '20%'}
		               ],
		"bPaginate": false,
//		"bInfo" : false,
		"sPaginationType" : "full_numbers",// แสดงตัวแบ่งหน้า
		"bLengthChange": true, // แสดงจำนวน record ที่จะแสดงในตาราง
		
		"iDisplayLength": 10, // กำหนดค่า default ของจำนวน record 
		"bScrollCollapse": true,
//		"aLengthMenu": [
//		                [10, 25, 50, 100, -1], // จำนวนที่แสดงในตาราง
//		                [10, 25, 50, 100, "ทั้งหมด"] // จำนวนที่ให้เลือก
//		 ],
//		 "bProcessing": true,    // เขียนโค้ดโดยระบุให้ไปดึงข้อมูลจากไฟล์ getDataTable มาทำงาน โดยเอาข้อมูลที่ได้มาแสดงใน table
//       "bServerSide": true,
//       "sAjaxSource": "../ACM4101Srvl?process_type=getDataTable"	
	});
});

